﻿<script type="text/html" id="Design/CollectionEditor">
	<div x-bind="with: { SelectedItem: ko.observable(null), Title: 'New Item', Context: ViewModel.SelectedElement() }">
		<div>
			<table>
				<tr>
					<td>
						<input x-bind="value: Title" />
					</td>
					<td><a x-bind="click: function() { SelectedItem(Context.AddItem(Title)); }" href="#">Add New Item</a></td>
				</tr>
			</table>
		</div>
		<div>
			<table>
				<tr>
					<td>
						<select x-bind="options: Context[$parent.Name], value: SelectedItem"></select>
					</td>
					<td><a x-bind="click: function() { Context.RemoveItem(SelectedItem()); }" href="#">Remove</a></td>
				</tr>
			</table>
		</div>
	</div>

</script>
